<!--v-for-->
<div id="app">
    <!--1.简单的列表渲染-->
    <ul v-for="n in 3">
        <li>{{n}}</li>
    </ul>
    <ul v-for="(n,index) in 5">
        <!-- 如果想获取索引，则使用index关键字，注意，圆括号中的index必须放在后面 -->
        <li >{{n}} - {{index}}</li>
    </ul>

    <!--2.遍历数据列表-->
    <table border="1">
        <!--<tr v-for="item in userList">-->
        <tr v-for="(item,index) in userList">
            <td>{{index}}</td>
            <td>{{item.id}}</td>
            <td>{{item.username}}</td>
            <td>{{item.age}}</td>
        </tr>
    </table>
</div>

<!--资料中拷贝js-->
<script src="vue.min.js"></script>

<script>
    //创建一个vue对象
    new Vue({
        el:'#app',//绑定vue作用的范围
        data:{
            userList:[
                {id:1,username:'helen',age:18},
                {id:2,username:'peter',age:28},
                {id:3,username:'andy',age:38}
            ]
        }
    })
</script>